<template>
	<div class="div">
		<h2>个人申请详情</h2>
		<div class="main">
			<el-descriptions title="基本信息">
				<el-descriptions-item label="个体名称:">{{
					store.userData.name
				}}</el-descriptions-item>
				<el-descriptions-item label="个体标识:">{{
					store.userData.number
				}}</el-descriptions-item>
				<el-descriptions-item label="所属行业:">{{
					store.userData.industry
				}}</el-descriptions-item>
				<el-descriptions-item label="法人姓名:">{{
					store.userData.legalName
				}}</el-descriptions-item>
				<el-descriptions-item label="身份证号:">{{
					store.userData.id
				}}</el-descriptions-item>
				<el-descriptions-item label="联 系 人:">{{
					store.userData.contacts
				}}</el-descriptions-item>
				<el-descriptions-item label="联系电话:">{{
					store.userData.phoneNumber
				}}</el-descriptions-item>
			</el-descriptions>
			<el-descriptions title="贷款信息">
				<el-descriptions-item label="贷款产品:">{{
					store.userData.productName
				}}</el-descriptions-item>
				<el-descriptions-item label="贷款金额:">{{
					store.userData.money
				}}</el-descriptions-item>
				<el-descriptions-item label="贷款期限:">{{
					store.userData.term
				}}</el-descriptions-item>
				<el-descriptions-item label="资金用途:">{{
					store.userData.use
				}}</el-descriptions-item>
				<el-descriptions-item label="意向网点:">{{
					store.userData.bank
				}}</el-descriptions-item>
				<el-descriptions-item label="有无房车:">{{
					store.userData.house ? "有" : "没有"
				}}</el-descriptions-item>
				<el-descriptions-item label="有无车辆:">{{
					store.userData.car ? "有" : "没有"
				}}</el-descriptions-item>
			</el-descriptions>
		</div>
		<div class="btn">
			<el-button type="primary" size="default" @click="handleSuccess"
				>申请通过</el-button
			>
			<el-button type="danger" size="default" @click="handleSuccess"
				>申请不通过</el-button
			>
			<el-button type="default" size="default" @click="handleReturn" class="btn"
				>返回</el-button
			>
		</div>
	</div>
</template>

<script lang="ts" setup>
import { useRoute } from "vue-router";
import { userProductDetilsFind } from "../../api/user";
import { userDetilsStore } from "../../store/userDetilsProduct";
const store = userDetilsStore();
const route = useRoute();
let { query } = route;

//查询个人申请产品详情
userProductDetilsFind(query.username as string).then((res) => {
	store.userData = res.data.results[0];
});

//返回按钮
const handleReturn = () => {
	history.go(-1);
};

//申请通过按钮
const handleSuccess = () => {};
</script>

<style scoped lang="scss">
.div {
	display: flex;
	flex-direction: column;
	background-color: #fff;
	padding: 0 20px;
	box-sizing: border-box;
	.btn {
		width: 60px;
		margin-bottom: 20px;
	}
	h2 {
		text-align: center;
		font-size: 28px;
	}
	.main {
		display: flex;
		justify-content: center;
		margin: 0;
	}
}
.el-form {
	width: 600px;
	.el-form-item {
		margin-bottom: 14px;
	}
}
.el-descriptions {
	padding: 20px;
	box-sizing: border-box;
	width: 49%;
	text-align: center;
	border: 1px solid #999;
	border-radius: 4px;
	margin-right: 20px;
	margin-bottom: 35px;
	:deep(.el-descriptions__header) {
		justify-content: center;
		.el-descriptions__title {
			font-size: 18px;
		}
	}
	:deep(.el-descriptions__cell) {
		display: flex;
		.el-descriptions__label {
			font-weight: bold;
		}
		.el-descriptions__content {
			width: 70%;
		}
	}
}
.el-descriptions:last-of-type {
	margin-right: 0;
}
.el-button {
	margin-left: 20px;
}
.btn {
	display: flex;
}
</style>
